
import React from 'react'
import { Outlet } from 'react-router'
import { UploadOutline,SearchOutline,AddOutline,ScanningFaceOutline } from 'antd-mobile-icons'
import { Graphic,ManagerO } from '@react-vant/icons';
import 'animate.css';
import tp from './t4.png'
import { useNavigate } from 'react-router-dom';
let App =()=>{
    let nav =useNavigate()
    return (
        <>
            <div style={{width:'100%',height:'100vh'}}>
                <div style={{padding:'4rem 1rem'}}>
                    <img src={tp} alt="" style={{width:'12rem',height:'8rem'}}/>
                    <div>
                        <h2 style={{fontSize:'2.5rem',marginLeft:'1rem'}}>欢迎登陆生鲜电商平台</h2>
                    </div>
                </div>
                <div className="animate__animated animate__bounce animate__bounceIn" style={{width:'40rem',height:'40rem',background:'rgb(255,255,255,0.5)',margin:'0 auto',marginTop:'3rem',borderRadius:'2rem'}}>
                    <Outlet ></Outlet>
                </div>
                <div style={{marginTop:'13rem',marginLeft:'6rem',height:'5rem',display:'flex'}}>
                    <div style={{textAlign:'center'}} onClick={()=>{nav('/sjlogin/zhang')}}>
                        <ManagerO style={{fontSize:'2rem',background:'rgb(255,255,255,0.8)',borderRadius:'50%'}} />
                        <p style={{fontSize:'1.2rem',width:'6rem'}}>账户登录</p>
                    </div>
                    <div style={{textAlign:'center'}} onClick={()=>{nav('/sjlogin/sjyam')}}>
                        <Graphic style={{fontSize:'2rem',background:'rgb(255,255,255,0.8)',borderRadius:'50%'}} />
                        <p style={{fontSize:'1.2rem',width:'6rem'}}>本机登录</p>
                    </div>
                    <div style={{textAlign:'center'}} onClick={()=>{nav('/sjlogin/sjren')}}>
                        <ScanningFaceOutline style={{fontSize:'2rem',background:'rgb(255,255,255,0.8)',borderRadius:'50%'}} />
                        <p style={{fontSize:'1.2rem',width:'6rem'}}>刷脸登录</p>
                    </div>
                    <div style={{textAlign:'center'}} onClick={()=>{nav('/sjlogin/sjzhu')}}>
                        <AddOutline style={{fontSize:'2rem',background:'rgb(255,255,255,0.8)',borderRadius:'50%'}}/>
                        <p style={{fontSize:'1.2rem',width:'6rem'}}>注册</p>
                    </div>
                    <div style={{textAlign:'center'}} onClick={()=>{nav('/sjlogin/sjhui')}}>
                        <SearchOutline style={{fontSize:'2rem',background:'rgb(255,255,255,0.8)',borderRadius:'50%'}}/>
                        <p style={{fontSize:'1.2rem',width:'6rem'}}>忘记密码</p>
                    </div> 
                </div>

            </div>
        </>
    )
}

export default App